<template>
  <div>
    <van-swipe :autoplay="3000" lazy-render>
      <van-swipe-item v-for="(item, index) in  store.cityList.list" :key="index">
        <a :href="item.url" target="_blank" v-if="item.url">
          <img :src="item.picture" />
        </a>
        <img v-else="item.url" :src="item.picture" />
      </van-swipe-item>
    </van-swipe>
  </div>
</template>

<script setup lang="ts">
import { bannerList } from "@/api/task.ts";
import { showToast } from "vant";
import { reactive, inject } from "vue";
import { taskStore } from "../../../store/task.ts";

// 声明inject
const { closeCitySwitch } = inject("popup");

const leftBack = () => closeCitySwitch();
const state = reactive({
  htmlText: "",
});
// 引用pinia的store
const store = taskStore();
const getBannerList = async () => {
  const res = await bannerList({
    type: 2,
  });
  if (res) {
    console.log(res,'--res')
    store.setCityList(res);
  } else {
    showToast(res.msg);
  }
};
if (store.bannerList.length <= 0) {
  getBannerList();
}
</script>

<style lang="scss" scoped>
img {
  width: 100%;
  height: 7.47rem;
  border-radius: 0.5rem;
}
</style>
